<template>
    <div class="info">
        <info-header></info-header>
        <info-intro></info-intro>
        <info-second></info-second>
        <info-third></info-third>
        <info-fourth></info-fourth>
        <info-fifth></info-fifth>
    </div>
</template>

<script>
import InfoFifth from './componments/InfoFifth.vue'
import InfoFourth from './componments/InfoFourth.vue'
import InfoThird from './componments/InfoThird.vue'
import InfoSecond from './componments/InfoSecond.vue'
import InfoIntro from './componments/InfoIntro.vue'
import InfoHeader from './componments/InfoHeader.vue'
import axios from 'axios'

export default {
    name:'info',
    components:{
        InfoFifth,
        InfoFourth,
        InfoThird,
        InfoSecond,
        InfoIntro,
        InfoHeader,
    },
     data: function(){
    return{
      iconList: [],
      recommendList: []
    }
  },
  mounted(){
    this.getHomeApiInfo()
  },
  methods: {
    getHomeApiInfo(){
      axios.get("/mock/home.json").then(this.getHomeResponseInfo)
    },
    getHomeResponseInfo(response){
      //  console.log(response.data);
      let res = response.data  //就是home.json里面的内容
      if(res.success && res.dataList){
        const data = res.dataList //取json中的datalist属性
        // console.log(data.iconLists.length)
        this.iconList = data.iconLists
        this.recommendList = data.recommendLists
      }
    }
  }
}
</script>

